<template>
	<view>
		<view class="head">
			<view class="date-box">
				<u-icon name="arrow-left" color="#aaa" @click="prev"></u-icon>
				<view class="" style="font-size: 25rpx;">{{dateVal}}</view>
				<u-icon name="arrow-right" color="#aaa" @click="next"></u-icon>
			</view>
		</view>
		<view class="list">
			<view class="list-item" v-for="item in list">
				<view class="list-item__left">{{item.name}}</view>
				<view class="list-item__right">{{item.value}}<text style="margin-left: 5rpx;">{{item.unit}}</text></view>
			</view>
		</view>
	</view>
</template>

<script>
	import moment from 'moment'
	import _custom from '../../../../common/_custom.js'
	import _data from '../../../../common/_data.js'
	
	export default {
		data() {
			return {
				username: _data.localData('name'),
				date: moment().format('YYYY-MM'),
				list: [
					{
						name: '工时',
						value: 6.9,
						unit: '小时'
					},
					{
						name: '出勤天数',
						value: 4.0,
						unit: '天'
					},
					{
						name: '休息天数',
						value: 3,
						unit: '天'
					},
					{
						name: '迟到',
						value: 0,
						unit: '次'
					},
					{
						name: '早退',
						value: 0,
						unit: '次'
					},
					{
						name: '缺卡',
						value: 0,
						unit: '次'
					},
					{
						name: '旷工',
						value: 0,
						unit: '天'
					},
				]
			}
		},
		onLoad() {
			this.getWorkAttendUserReport()
		},
		computed: {
			dateVal() {
				return moment(this.date).format('YYYY.MM')
			}
		},
		methods: {
			getWorkAttendUserReport() {
				let that = this;
				_custom.getDataJava({
					apiname: 'getWorkAttendUserReport',
					apiparam: {
						startdate: moment(this.date).startOf('month'),
						enddate: moment(this.date).endOf('month'),
						obsusername: this.username
					},
					success(res) {
						console.log(res)
						let total = res.length ? res[0] : {}
						that.list[0].value = isNaN((total.AttendMinutes / 60).toFixed(2)) ? '' : (total.AttendMinutes / 60).toFixed(2)
						that.list[1].value = total.AttendDays
						that.list[2].value = total.RestDays
						that.list[3].value = total.LateCount
						that.list[4].value = total.EarlyCount
						that.list[5].value = total.GoWorkMissCount * 1 + total.LeaveWorkMissCount*1 ? total.GoWorkMissCount * 1 + total.LeaveWorkMissCount*1 : ''
						that.list[6].value = total.NoWorkCount
					}
				})
			},
			prev() {
				this.date = moment(this.date).subtract(1,'months')
				this.getWorkAttendUserReport()
			},
			next() {
				this.date = moment(this.date).subtract(-1,'months')
				this.getWorkAttendUserReport()
			}
		}
	}
</script>

<style>
	.head {
		background-color: #fff;
		padding: 30rpx 20rpx;
	}
	
	.date-box {
		width: 300rpx;
		height: 60rpx;
		display: flex;
		justify-content: space-around;
		align-items: center;
	}
	
	.list {
		background-color: #fff;
		margin-top: 30rpx;
	}
	
	.list-item {
		height: 100rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1rpx solid #eee;
		padding: 0 30rpx;
	}
	
	.list-item__left {
		font-size: 30rpx;
	}
	
	.list-item__right {
		font-size: 25rpx;
		color: #aaa;
	}
</style>
